{% extends 'master.html' %}
{% load space2nbsp %}
{% load static %}
{% block content %}
    <link href="{% static "css/news.css" %}" rel="stylesheet" type="text/css" media="all"/>
    <script type="text/javascript" src="{% static "js/jquery-1.8.0.min.js" %}"></script>
    <script type="text/javascript" src="{% static 'js/jquery.min.js' %}"></script>
    <script type="text/javascript" src="{% static 'js/layer.js' %}"></script>

    <!-- 头部开始 -->
    <div class="container">
        <div class="weizhi"><strong class="red">当前位置:</strong> 首页 - 新闻中心</div>
        <div class="w655 left">

            <!-- 新闻详细内容开始 -->
            <div class="s_tt">{{ news.title }}</div>
            <div class="s_xx">时间：{{ news.date }}&nbsp;&nbsp;作者：{{ news.author }}浏览：{{ news.click }}  </div>
            <div class="s_nr"> {{ news.text|entertobr|spacetonbsp }}</div>
            {% if not selected == -1 %}
                <div class="nypaihang f14" style="text-align: center">
                    <h3 class="tjhc_t"><strong class="f18 hei">你喜欢本条新闻吗？</strong></h3>
                    {% if  selected  == 0 %}
                        <form name="score" action="{% url 'newsrecommand:news' news.article_id %}" method="post"
                              onload="clear()">
                            <div class="content">
                                <div id="startone" class="block clearfix">
                                    <div class="star_score"></div>
                                    <p style="float:left;">您的评分：<span class="fenshu" id="fenshu"></span> 分</p>
                                    <input type="hidden" name="score">
                                </div>
                                <script type="text/javascript" src="{% static "js/startScore.js" %}"></script>
                                <script>
                                    scoreFun($("#startone"))
                                    scoreFun($("#starttwo"), {
                                        fen_d: 22,//每一个a的宽度
                                        ScoreGrade: 5//a的个数 10或者
                                    })
                                    //显示分数
                                    $(".show_number li p").each(function (index, element) {
                                        var num = $(this).attr("tip");
                                        var www = num * 2 * 16;//\
                                        $(this).css("width", www);
                                        $(this).parent(".atar_Show").siblings("span").text(num + "分");
                                    });
                                    $(function () {
                                        $(".star_score").on("click", function () {
                                            var num = document.getElementById("fenshu").innerText;
                                            $("input[name='score']").val(num);
                                        });
                                    })

                                    function clear() {
                                        $("input[name='score']").val("");

                                    }
                                </script>
                            </div>
                            <br/>
                            <div style="text-align: center"><input type="submit" value="确定"></div>
                        </form>
                    {% endif %}
                    {% if selected == 1 %}
                        <span>你已经评过分啦</span>
                    {% endif %}
                </div>
            {% endif %}
        </div>
        <!-- 新闻详细内容结束 -->
        <div class="w330 right">
            <div class="k10"></div>
            <!-- 热门文章 开始 -->
            <h3 class="tjhc_t"><strong class="f18 hei">热门新闻</strong></h3>
            <div class="k10"></div>
            <ul class="nypaihang f14">
                {% for article in hot_news %}
                    <li style="overflow : hidden;text-overflow:ellipsis;white-space: nowrap;">
                        <a href="{% url 'newsrecommand:news' article.article_id %}">
                            <span>{{ article.title }}</span>
                        </a>
                    </li>
                {% endfor %}
            </ul>
        </div>
        <div class="clear"></div>
        <!-- 热门文章 结束 -->
    </div>
    <div class="clear"></div>
{% endblock %}
